<template>
	<view class="main">
		<view class="view-top">
			<image style="height: 336rpx;width: 100%;" mode="scaleToFill" :src="detail_bg"></image>
		</view>
		<view  class="view-top2">
			<view class="">
				<view style="display: flex;align-items: center;justify-content: center;">
					<image :src="users.avatarPic" 
					style="width: 130rpx;height: 130rpx;border-radius: 65rpx;"></image>
				</view>
				
				<view style="display: flex;align-items: center;justify-content: center;margin-top: 20rpx;">
					<text class="top-name">{{users.user.account.realName}}</text>
				</view>
				
				
			</view>
		</view>
		<view v-if="tag=='customer' || tag=='sponsor'">
			<view class="view-center">
				<text style="margin-left: 32rpx;">联系方式</text>
			</view>
			<view style="margin-top: 48rpx;">
				<view style="display: flex;align-items: center;">
					<text class="center-title">姓名：</text>
					<text class="center-value">{{users.user.account.realName}}</text>
				</view>
				
				<view style="display: flex;align-items: center;margin-top:20rpx">
					<text class="center-title">联系电话：</text>
					<text class="center-value">{{users.user.account.mobile}}</text>
				</view>
				
				<view style="display: flex;align-items: center;margin-top:20rpx">
					<text class="center-title">微信号：</text>
					<text class="center-value">{{users.user.account.wxNo}}</text>
				</view>
				
				<view style="display: flex;align-items: center;margin-top:20rpx">
					<text class="center-title">邮箱：</text>
					<text class="center-value">{{users.user.account.email}}</text>
				</view>
				
			</view>
		</view>
		
		<view v-if="tag=='lawyer'">
			<view class="view-center" style="justify-content: center;">
				<view  @click="clickTagTabs(1)">
					<view :class="tagTab==1?'tagTab-tv':'tagTab-tv2'">律师介绍</view>
					<view style="width: 130rpx;display: flex;align-items: center;justify-content: center;">
						<view :class="tagTab==1?'line-tv':'line-tv2'"></view>
					</view>
					
				</view>
				<view style="margin-left: 96rpx;"  @click="clickTagTabs(2)">
					<view :class="tagTab==2?'tagTab-tv':'tagTab-tv2'">联系方式</view>
					<view style="width: 130rpx;display: flex;align-items: center;justify-content: center;">
						<view :class="tagTab==2?'line-tv':'line-tv2'"></view>
					</view>
			
				</view>
			</view>
			
			<view v-if="tagTab==1">
				<view class="desc-view">
					<rich-text :nodes="users.user.remark"></rich-text>
					
				</view>
			</view>
			
			<view v-if="tagTab==2" style="margin-top: 48rpx;">
				<view style="display: flex;align-items: center;">
					<text class="center-title">姓名：</text>
					<text class="center-value">{{users.user.account.realName}}</text>
				</view>
				
				<view style="display: flex;align-items: center;margin-top:20rpx">
					<text class="center-title">联系电话：</text>
					<text class="center-value">{{users.user.account.mobile}}</text>
				</view>
				
				<view style="display: flex;align-items: center;margin-top:20rpx">
					<text class="center-title">微信号：</text>
					<text class="center-value">{{users.user.account.wxNo}}</text>
				</view>
				
				<view style="display: flex;align-items: center;margin-top:20rpx">
					<text class="center-title">邮箱：</text>
					<text class="center-value">{{users.user.account.email}}</text>
				</view>
			</view>
			
		</view>
		
		
	</view>
</template>

<script>
import verify from '../../../utils/verifyUtils'
	let app = ''
	export default{
		data(){
			return{
				tag:'',
				tab:"1",
				
				tagTab:1,// 1：律师介绍  2：律师联系方式
				users:null,
				detail_bg:getApp().globalData.baseImageUrl+'/detail_bg.png'
			}
		},
		onLoad(options) {
			app = getApp()
			let title = ''
			let _this = this
			_this.tag = options.tag
	
			_this.users = JSON.parse(decodeURIComponent(options.users))
			
			
			console.log('-----------',_this.users)
			
			let avatarPic = _this.users.avatarPic
			if(verify.isNotEmpty(avatarPic) && avatarPic.indexOf('http')<0){
				avatarPic = this.$imageUrls({picUrls: avatarPic})
			}
			_this.users.avatarPic = avatarPic
			
			if(options.tag=='lawyer'){title='承办律师'}
			if(options.tag=='customer'){title='参与用户'}
			if(options.tag=='sponsor'){title='发起人'}
			uni.setNavigationBarTitle({
				title:title
			})
			
		},
		onShow() {
			
		},
		mounted() {
			
		},
		methods:{
			clickTagTabs(val){
				this.tagTab = val
			}
		}
	}
</script>

<style>
	page{
		background-color: #ffffff;
	}
	
</style>
<style scoped lang="scss">
	.main{
			
	}
	.view-top{
		width: 100%;
		height: 336rpx;
	}
	.view-top2{
		width: 100%;
		height: 336rpx;
		margin-top: -336rpx;
		display: flex;
		align-items: center;
		justify-content: center;
	}
	.top-name{
		font-size: 36rpx;
		font-family: PingFangSC-Semibold, PingFang SC;
		font-weight: 600;
		color: #FFFFFF;
	}
	.view-center{
		height: 88rpx;
		background: #FFFFFF;
		box-shadow: 0px 4rpx 8rpx 0px rgba(0,0,0,0.0600);
		display: flex;
		align-items: center;
		font-size: 32rpx;
		font-family: PingFangSC-Semibold, PingFang SC;
		font-weight: 600;
		color: #333333;
	}
	.center-title{
		margin-left: 32rpx;
		width: 140rpx;
		font-size: 28rpx;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;
		color: #999999;
	}
	.center-value{
		font-size: 28rpx;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;
		color: #333333;
		margin-left:20rpx
	}
	
	.line-tv{
		width: 80rpx;
		height: 4rpx;
		background: #2DA9C5;
		margin-top: 5rpx;
	}
	.line-tv2{
		margin-top: 5rpx;
		width: 80rpx;
		height: 4rpx;
		background: #ffffff;
	}
	.tagTab-tv{
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 32rpx;
		font-family: PingFangSC-Semibold, PingFang SC;
		font-weight: 600;
		color: #333333;
	}
	.tagTab-tv2{
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 32rpx;
		font-family: PingFangSC-Semibold, PingFang SC;
		font-weight: 400;
		color: #999999;
	}
	
	.desc-view{
		margin-top: 48rpx;
		padding-left: 32rpx;
		padding-right: 32rpx;
		font-size: 28rpx;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;
		color: #333333;
		line-height: 40rpx;
		text-indent: 2em;
	}
</style>